<script setup>
import { inject, onMounted, ref, shallowRef, defineAsyncComponent } from "vue";
import { useRoute } from "vue-router";
import { getArticleDetail } from "@/api/article.js";

const getAssetsFile = inject("getAssetsFile");

const route = useRoute();

// 获取当前路由的参数
const pageType = ref(route.query.type);
const pageTitle = ref(route.query.name);
console.log(pageTitle.value);

const form = ref({
	id: 0,
	articleColumnId: 1,
	title: "",
	outline: "",
	content: "",
	isView: 0,
	isTop: 0,
	isRoll: 0,
	clickNum: 0,
	createTime: "",
	updateTime: "",
	titleFiles: [],
	richFiles: [],
});

const title = ref("");
const content = shallowRef("");
const updateTime = ref("1970-01-01 00:00:00");
const filelist = ref([]);
const getArticle = async () => {
	const res = await getArticleDetail({ id: route.query.id });
	try {
		console.log("res.data", res.data);
		if (res.data.code === 200) {
			title.value = res.data.data.title;
			content.value = res.data.data.content;
			updateTime.value = res.data.data.updateTime;
			filelist.value = res.data.data.attachFiles;
		} else {
			// console.log(res.data.msg)
		}
	} catch (e) {
		console.log(e);
	}
};
getArticle();

onMounted(async () => {
	// await getArticle()
	// pageType.value === 'industry' ? await getArticle() : ''
});
const toload = (data) => {
	window.open(data, "_bank");
};
</script>

<template>
	<div class="pageContent">
		<p style="text-align: center">
			<span style="font-size: 24pt">{{ title }}</span>
		</p>

		<p style="text-align: center">
			<span style="font-size: 10pt; color: #95a5a6">发布时间:{{ updateTime }}</span>
		</p>
		<div style="height: 1px; width: 100%; background-color: #eeeeee; margin-top: 10px; margin-bottom: 10px"></div>
		<div class="main">
			<div v-html="content"></div>
		</div>
		<div>
			<div>附件：</div>
			<div v-for="(item, index) in filelist" :key="index" @click="toload(item.accessUrl)" style="cursor: pointer; color: #4d79ff">
				{{ item.originalName }}
			</div>
		</div>
	</div>
</template>

<style scoped>
:deep(.main img) {
	width: 100% !important;
}
</style>
